<template>
	<view class="frozen-assets_wrapper">
		<view class="frozen-assets_header">
			<view class="assets_title">已冻结:</view>
			<view class="assets_count">
				<text>{{$util.roundNumber(frozenAssetsData.hold,2) || 0.00}} PCD</text>
				<text>≈ {{$util.roundNumber(frozenAssetsData.cny,2) || 0.00}} CNY</text>
			</view>
		</view>
		<view class="frozen-assets_list">
			<view class="assets_item" @click="jumpAssetsDetails(1)">
				<view class="assets_item--left">
					<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/wallet/kewakuang.svg"></image>
					<text>可挖矿</text>
				</view>
					<view class="assets_item--right">
					<text>{{$util.roundNumber(frozenAssetsData.avaliable_amount,2) || 0.00}} PCD</text>
					<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/common/arrowRight.svg"></image>
				</view>
			</view>
			<view class="assets_item" @click="jumpAssetsDetails(2)">
				<view class="assets_item--left">
					<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/wallet/wakuangzhong.svg"></image>
					<text>挖矿中</text>
				</view>
				<view class="assets_item--right">
					<text>{{$util.roundNumber(frozenAssetsData.hold_amount_mining,2) || 0.00}} PCD</text>
					<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/common/arrowRight.svg"></image>
				</view>
			</view>
			<view class="assets_item" @click="jumpAssetsDetails(3)">
				<view class="assets_item--left">
					<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/wallet/jiecang.svg"></image>
					<text>解仓中</text>
				</view>
				<view class="assets_item--right">
					<text>{{$util.roundNumber(frozenAssetsData.hold_amount_unlock,2) || 0.00}} PCD</text>
					<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/common/arrowRight.svg"></image>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import uniIcon from "@/components/uni-icon/uni-icon.vue";
	export default {
		data() {
			return {
				frozenAssetsData:{}  // 冻结资产基本数据
			}
		},
		onShow() {
			this.onFrozenAssets()
		},
		methods: {
			// 获取冻结资产基本数据
			onFrozenAssets(){
				this.$api.frozenAssets({},res=>{
					if(res.data.type === "ok"){
						this.frozenAssetsData = res.data.message
					}
				})
			},
			// 跳转详情页
			jumpAssetsDetails(id){
				uni.navigateTo({
					url:'/pages/wallet/assetsDetails?id=' + id
				})
			}
		},
		components:{
			uniIcon
		}
	}
</script>

<style lang="scss" scoped>
	.frozen-assets_wrapper {
		
	}
	.frozen-assets_header{
		height:400upx;
		padding:0 70upx;
		color:#FFFFFF;
		background-image:url('https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/wallet/frozenAssets.png');
		background-size:100%;
		
		.assets_title{
			height:150upx;
			line-height: 150upx;
			font-size: 15px;
			padding:10upx 0;
		}
		.assets_count{
			text:first-child{
				font-size: 28px;
			}
			text:last-child{
				display: block;	
				font-size: 15px;
			}
		}
	}
	.frozen-assets_list{
		width:92%;
		margin: 0 auto;
		.assets_item{
			display:flex;
			justify-content:space-between;
			height:126upx;
			padding:0 30upx;
			margin-top:22upx;
			box-shadow:0px 1px 0px 0px rgba(231,231,231,1);
			border-radius:10px;
			background-color:#FFFFFF;
			.assets_item--left,.assets_item--right{
				display:flex;
				align-items:center;
			}
			.assets_item--left{
				image{
					width:40upx;
					height:40upx;
					margin-right:10upx;
					margin-top:8upx;
				}
			}
			.assets_item--right{
				text{
					color:#E13E4D;
				}
				image{
					width:20upx;
					height:20upx;
					margin-left:10upx;
				}
			}
		}
	}	
</style>
